모바일 웹에서 사진을 state로 들고 있어도 될까요?

Q. 모바일 웹에서 사진을 state로 들고 있어도 될까요?

포포테토칩00

모바일 웹에서 사진 업로드 기능을 처음 만들어보고 있는 초보 개발자입니다. 사용자가 사진을 선택하면 원본을 그대로 쓰지 않고 미리 리사이즈한 뒤(예: 1920px 정도) React state에 Blob 형태로 들고 있다가 저장 버튼을 누를 때 한 번에 업로드하는 방식을 생각하고 있습니다. 다만 사진이 여러 장이 될 경우, React state에 Blob 파일을 계속 들고 있는 게 모바일에서 메모리 문제를 일으킬 수 있는지, 이런 경우 IndexedDB 같은 브라우저 저장소를 사용하는 게 더 일반적인지가 궁금해졌습니다. 그래서 질문은: 모바일 웹 기준으로 리사이즈된 이미지라면 state로 몇 장 정도까지는 무리 없이 사용하는 편인지 사진이 많아질 경우, 실제 현업에서는 state로만 관리하는지, IndexedDB를 함께 사용하는지 IndexedDB를 쓰는 게 과한 선택인지, 아니면 흔한 패턴인지 알고 싶습니다. 모바일 웹을 경험해보신 분들의 조언이 간절합니다..! ㅠㅠ

2026.01.18

답변 2

만
만나서 반갑습니다.함박웃음치과
코과장 ∙ 채택률 61%
안녕하세요 리사이즈(1920px)라도 Blob를 state에 여러 장 오래 들고 있으면 메모리 급증(특히 iOS Safari)해서 “몇 장” 정답은 없지만, 실무에선 보통 state엔 메타/미리보기(URL)만 두고 원본·리사이즈 데이터는 업로드 직전까지 최소화합니다. 사진이 많거나 ‘저장 버튼까지 오래 대기’ 시나리오면 IndexedDB에 파일(Blob) 저장 + state에는 key만 유지가 더 안전·일반적이고, 업로드 후에는 URL.revokeObjectURL/참조 해제로 메모리 회수까지 챙기는 편입니다.
2026.01.18
전문상담HL 디앤아이한라
코이사 ∙ 채택률 63%
안녕하세요, 성실히 답변 드리겠습니다. 채택 바랍니다.^^ 모바일 웹 기준으로 리사지으된 이미지라도 Blob를 state에 많이 들고 있으면 메모리 부담이 생길 수 있습니다. 몇장 정도까지 무리 없는지는 디바이스 성능에 따라 다르지만, 보통 5-10장 이상이면 주의하는 편입니다. 현업패턴 > 소수장(1-5장)은 state에 그대로 들고 쓰기도 하지만, 사진이 많거나 장기간 보관해야 하면 indexedDB나 Cache API 같은 브라우저 저장소를 함께 쓰는것이 일반적입니다. > IndexedDB는 과한 선택이 아니라, 대용량 파일 / 여러장 이미지 관리 시 흔히 쓰는 패턴입니다. 즉 장수가 적으면 state 만으로도 가능하지만, 많아지면 indexedDB 병행이 안정적입니다.
2026.01.17
AD
반도체
설계팀
대기업 반도체 산업으로 취업하기 위해선, 직관적 해석능력과 사고력이 필요합니다. 핵심 역량과 배운 지식을 취업에 활용하고 싶다면 국비지원 강의를 추천합니다.